<template>
	<view class="wxlogin_box">
		<image class="img" src="../../static/logo.png" mode="scaleToFill"></image>
		<button class="text1" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">快捷登录</button>
		<button class="text1" style="background:#CCC;top:50%" @click="noLogin">取消登录</button>
		<view class="agreement">
			<checkbox-group @change="handleChange">

				<checkbox value="1"></checkbox>

			</checkbox-group>
			<text @click="showAgree">同意《服务协议》</text>
		</view>
		<!-- 	<view style="margin-top: 150rpx;width: 700rpx;
    overflow-x: auto;">
			{{optionsheader}}
		</view> -->
		<!-- <button class="text phone" @click="tologin">手机登录</button> -->
		<!-- 叫微信登录会被监管不允许 -->
		<!-- <button class="text" @click="fn4">微信登录</button> -->
		<!-- <button class="text" @click="fn1">获取用户信息</button> -->
		<uni-popup ref="popup" type="center">
			<phoneLogin @close="close" @login="login"></phoneLogin>
		</uni-popup>
		<uni-popup ref="popup1" type="center">
			<view class="text_box">
				<view class="text">
					1. 服务协议的确认和接纳
				</view>
				<view class="text">
					「天天幸运站」微信小程序是由湖南锐行科技有限公司拥有所有权与经营权的产品。用户在接受天天幸运站小程序的服务之前，请务必仔细阅读本条款并同意本声明。访问者通过各类方式使用天天幸运站小程序的行为，都将被视为是对本声明全部内容的无异议的认可。
				</view>
				<view class="text">
					a. 用户直接或间接通过各类方式产生与小程序相关的行为时，都将被视为已无条件接受本声明所涉及的全部内容；若用户对本声明的任何条款有异议，请停止使用天天幸运站小程序所提供的全部服务。
				</view>
				<view class="text">
					b. 当用户使用天天幸运站小程序的服务时，需遵守中国的法律法规并保证信息的真实性，同时应当恪守以下承诺：
				</view>
				<view class="text">
					1) 用户只有在同意遵守相关法律法规和本协议时，才有权使用天天幸运站小程序的服务，无论用户是否有意访问或使用此服务。
				</view>
				<view class="text">
					2) 如果用户不同意天天幸运站小程序对协议相关条款的修改，则有权停止使用服务。如果继续使用服务，则视为已接受天天幸运站小程序最新服务协议条款。
				</view>
				<view class="text">
					3) 若用户提交任何违法或者天天幸运站小程序认为不适合在其平台上展示的资料，天天幸运站小程序则有理由怀疑用户的资料属于恶意操作，并且有权暂停或终止用户的账号。
				</view>
				<view class="text">
					4)
					天天幸运站小程序仅对用户填写的信息与内容进行形式审查，不进行实质性审查（实质性审查包括但不限于鉴别、核实任何登记资料和活动内容的真实性、正确性以及是否为最新资料的审查）对此所产生的纠纷天天幸运站小程序不承担任何过错和责任，也没有予以协调的义务。
				</view>
				<view class="text">
					5) 用户有保证其信息和资料详尽、准确并对其及进行时更改的义务。
				</view>
				<view class="text">
					2. 用户使用规则
				</view>
				<view class="text">
					a. 用户有义务保管好个人微信账号的相关信息并对以其进行的所有行为负法律责任。用户不应将其账号、密码转让或借予他人使用。因黑客行为或用户的保管疏忽导致账号、密码外泄，天天幸运站小程序不承担任何责任。
				</view>
				<view class="text">
					b. 用户在使用天天幸运站小程序的服务时，须向天天幸运站小程序提供真实资料并及时更新。天天幸运站小程序会根据用户的权限设置对用户资料的信息进行保密。
				</view>
				<view class="text">
					c. 用户同意接受天天幸运站小程序通过微信服务通知、订阅消息通知、短信或其他方式向用户发送活动通知及其相关信息。
				</view>
				<view class="text">
					d.
					根据有关法律法规，天天幸运站小程序在此郑重提醒用户：任何经由本服务发布的文字、图片信息，无论是公开还是私密发布，均需由天天幸运站小程序工作人员进行审核。天天幸运站小程序仅为用户提供活动发布平台，无法控制经由本服务发布的活动现场情况，因此不保证活动是否符合用户的预期。但天天幸运站小程序有权依法停止发布任何不符合平台规则的内容并采取相应措施，包括但不限于暂停用户使用本服务，保存有关记录，并向有关机构报告。
				</view>
				<view class="text">
					e.
					用户保证对其通过天天幸运站小程序服务发布的内容拥有完整的合法的知识产权，保证天天幸运站小程序使用该内容不违反国家的法律法规，也不侵犯第三方的合法权益或承担任何义务。用户承诺上传的内容不涉及侵犯他人著作权、商标、名誉、隐私及其他一切违法内容。用户应对其所提供内容因形式、内容及授权的不完善、不合法所造成的一切后果承担完全责任。
				</view>
				<view class="text">
					f.
					用户承诺遵循中华人民共和国有关互联网使用以及金融支付的的法律法规，不从事洗钱、诈骗、以及其他任何破坏社会主义经济秩序的活动；用户使用本服务的行为若有任何违反国家法律法规或侵犯第三方的合法权益时，天天幸运站小程序将保留向公安机关以及国家有关监管部门举报的权利。
				</view>
				<view class="text">
					g. 用户在使用天天幸运站小程序服务期间，本协议将保持完整的效力。如果用户所发布的活动与法律相抵触或者不符合本协议，天天幸运站小程序可以在不发出任何通知的情况下，随时终止用户的注册用户资格。
				</view>
				<view class="text">
					3. 隐私保护
				</view>
				<view class="text">
					a. 天天幸运站小程序在用户使用其服务时可能获取的信息：
				</view>
				<view class="text">
					1) unionid信息：当用户使用天天幸运站小程序的服务时，微信会将一个unionid（字符串形式）传送到天天幸运站小程序服务器上，以便储存用户的偏好设定，从而提供更好的服务。
				</view>
				<view class="text">
					2) 日志信息：当用户使用天天幸运站小程序的服务时，其服务器会自动记录用户浏览器所传送的信息。服务器日志包含用户的请求、传送请求的日期和时间等。
				</view>
				<view class="text">
					3) 用户在参与活动过程中填写的信息：天天幸运站小程序会根据隐私权政策对用户填写的所有信息进行保密，除下述条款描述需要披露的情况之外，皆不对任何第三方披露。
				</view>
				<view class="text">
					b. 用户的个人信息将在下述情况下部分或全部被披露：
				</view>
				<view class="text">
					1) 经用户同意，向第三方披露；
				</view>
				<view class="text">
					2) 根据有关法律规定，或应行政、司法机构的要求，向第三方或者行政、司法机构披露；
				</view>
				<view class="text">
					3) 如果用户出现违反中国有关法律或者政策的情况，需要向第三方披露；
				</view>
				<view class="text">
					4) 为提供用户所要求的商品和服务，而必须和第三方分享用户的个人信息（不包括填表信息）；
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import CryptoJS from 'crypto-js';
	import phoneLogin from './phoneLogin.vue';
	export default {
		components: {
			phoneLogin
		},
		data() {
			return {
				optionsheader: "",
				agree: [],
				mobile: null,
				dl_but: false,
				wx_code: null,
				session_key: null,
				wx_sessionKey: null, //用户密钥，跟openid同一个接口的
				wx_phoneNumber: "", //电话号码
				appid: null,
				secret: null,
				grant_type: null,
				longin_true: false,
				encryptedData: null,
				iv: null,
				returnUrl: "",
			};
		},
		async onLoad(query) {
			console.log("lognquery", query)
			this.loginIn();
			this.optionsheader = uni.getStorageSync('optionsheader', 'session');

			if (query) {
				if (query.returnUrl) {
					this.returnUrl = "/" + query.returnUrl;
				}
			}
			var route = uni.getStorageSync('currentPage', 'session');
			console.log("route", route)
			console.log(query)
			console.log("returnUrl222", this.returnUrl)
			// this.getUserInfo()
			// await uni.login({
			// 	provider: 'weixin',
			// 	success: res_code => {
			// 		this.wx_code = res_code.code
			// 	}
			// })
		},
		methods: {
			handleChange(e) {
				console.log(e.detail.value)
				this.agree = e.detail.value.join(';');
			},
			handleCheckboxChange(val) {
				console.log(val)
			},
			changeCheckbox(val) {
				console.log(val)
			},
			showAgree() {
				this.$refs.popup1.open();
			},
			noLogin() {
				uni.navigateTo({
					url: "/pagesPrize/index/index"
				})

			},
			async loginIn() {
				await uni.login({
					provider: 'weixin',
					success: res_code => {
						console.log("weixin")
						console.log(res_code)
						this.wx_code = res_code.code
					}
				})
			},

			tologin() {
				this.$refs.popup.open();
			},
			close() {
				this.$refs.popup.close();
			},
			login(v) {
				uni.setStorageSync('wx_user_token', v);
				this.close();
				console.log(this.returnUrl)

				if (this.returnUrl) {
					uni.setStorageSync('currentPage', "", 'session');
					uni.redirectTo({
						url: this.returnUrl
					});
				} else {
					uni.switchTab({
						url: '/pages/home/home'
					});
				}
			},
			// 第一步获取手机号码
			getPhoneNumber(e) {


				if (this.agree.length == 0) {
					uni.showToast({
						icon: "error",
						title: "请勾选协议"
					})
					return
				}
				console.log(e.detail.encryptedData, "获取电话数据");
				uni.$http.get('/user/index/info').then(res => {
					console.log("getPhoneNumber");
					console.log(res.data.data);

					this.appid = res.data.data.appId
					this.secret = res.data.data.secret
					this.grant_type = res.data.data.grant_type
					// 正式环境
					this.wx_loin(e)
					// 测试环境
					//this.wx_login_text()
				})
			},

			wx_login_text() {
				let formData = {
					mobile: '15084784814', // 这里是解密得到的电话号码
					photo: 'https://thirdwx.qlogo.cn/mmopen/vi_32/POgEwh4mIHO4nibH0KlMECNjjGxQUq24ZEaGT4poC6icRiccVGKSyXwibcPq4BWmiaIGuG1icwxaQX6grC9VemZoJ8rg/132',
					nickname: '微信用户15084784814',
					unionid: 'oEjwe5cIiaMy-f_cSOySxv7AGQQ0',
					openid: 'ojn3f6mUqsyYP1F7JU99QqgFhbCY',
				};
				uni.$http.post('/user/index/authorize', formData)
					.then(authRes => {
						// 在这里，如果服务器返回了用户的 token，你应该将它保存到本地，然后在后续的请求中使用
						console.log(authRes.data, "返回数据");
						this.longin_true = true
						if (authRes.data.code == 0) {
							uni.showToast({
								title: `${authRes.data.msg}`,
								duration: 3000,
								icon: 'none'
							});
							return
						}
						// 在这里，如果服务器返回了用户的 token，你应该将它保存到本地，然后在后续的请求中使用
						if (authRes.data.data) {
							uni.setStorageSync('wx_user_token', authRes.data.data);
						}
						uni.switchTab({
							url: '/pages/home/home'
						});
					}).catch(authErr => {
						console.log(authErr);
						this.loginIn()
					});
			},

			// 第二步获取登录凭证	
			wx_loin(e) {
				console.log('this.wx_code:', this.wx_code)
				// uni.login({
				// 	provider: 'weixin',
				// 	success: res_code => {
				// 		this.wx_code = res_code.code
				uni.$http.get('/user/index/getSessionKey', {
					code: this.wx_code
				}).then(getSessionKey => {
					this.wx_sessionKey = getSessionKey.data.data.session_key
					console.log(e.detail.encryptedData, "登录加密1");
					console.log(e.detail.iv, "登录加密2");
					this.encryptedData = e.detail.encryptedData
					this.iv = e.detail.iv
					// 使用解密函数进行解密
					let data = this.decryptData(this.appid, this.wx_sessionKey, this
						.encryptedData, this.iv);
					// 解密手机号码 data.phoneNumber
					this.wx_phoneNumber = data.phoneNumber
					console.log(this.wx_phoneNumber, "电话号码");
					// 获取用户信息
					uni.getUserInfo({
						provider: 'weixin',
						success: (infoRes) => {
							console.log(infoRes, '获取用户信息');
							if (infoRes.errMsg === 'getUserInfo:ok') {
								// 用户同意了获取用户信息
								let userInfo = infoRes
									.userInfo; // 用户的公开信息（昵称、头像等）
								// 发送 GET 请求，获取登录参数
								uni.$http.get('/user/index/info', {
									code: this.wx_code
								}).then(infoRes => {
									// 登录注册参数
									let formData = {
										mobile: this
											.wx_phoneNumber, // 这里是解密得到的电话号码
										photo: userInfo
											.avatarUrl,
										nickname: `${userInfo.nickName}${this.wx_phoneNumber}`,
										unionid: getSessionKey.data.data.openid,
										openid: getSessionKey.data.data.unionid
									};

									uni.$http.post('/user/index/authorize', formData)
										.then(authRes => {
											// 在这里，如果服务器返回了用户的 token，你应该将它保存到本地，然后在后续的请求中使用
											console.log(authRes.data, "返回数据");
											this.longin_true = true
											if (authRes.data.code == 0) {
												uni.showToast({
													title: `${authRes.data.msg}`,
													duration: 3000,
													icon: 'none'
												});
												return
											}
											// 在这里，如果服务器返回了用户的 token，你应该将它保存到本地，然后在后续的请求中使用
											if (authRes.data.data) {
												uni.setStorageSync('wx_user_token', authRes
													.data.data);
											}

											if (this.returnUrl) {
												uni.redirectTo({
													url: this.returnUrl
												});

											} else {
												uni.switchTab({
													url: '/pages/home/home'
												});
											}

											// uni.navigateBack();
											// uni.navigateBack({
											// 	delta: 2
											// });
										}).catch(authErr => {
											console.log(authErr);
											this.loginIn()
										});
								}).catch(infoErr => {
									console.log(infoErr);
									this.loginIn()
								});
							} else {
								// 用户拒绝了获取用户信息
								uni.showModal({
									title: '提示',
									content: '为了更好的体验，需要您同意授权',
									showCancel: false
								});
							}
						}
					});
				}).catch(() => {
					// 授权失败
					this.loginIn()
				})
				// 	}
				// });
			},

			decryptData(appId, sessionKey, encryptedData, iv) {
				console.log('appId', appId, 'sessionKey:', sessionKey, 'encryptedData：', encryptedData, 'iv:', iv)
				let timerId = setTimeout(() => {
					uni.showToast({
						title: "微信授权失败,请重新登录!",
						duration: 4000,
						icon: 'none'
					});
				}, 2500);
				var key = CryptoJS.enc.Base64.parse(sessionKey);
				var encryptedWordArray = CryptoJS.enc.Base64.parse(encryptedData);
				iv = CryptoJS.enc.Base64.parse(iv);

				var decrypted = CryptoJS.AES.decrypt({
						ciphertext: CryptoJS.lib.WordArray.create(encryptedWordArray.words)
					},
					key, {
						iv: iv,
						mode: CryptoJS.mode.CBC,
						padding: CryptoJS.pad.Pkcs7
					}
				);

				let decryptedString = decrypted.toString(CryptoJS.enc.Utf8);
				let decoded;
				try {
					decoded = JSON.parse(decryptedString);
					clearTimeout(timerId)
				} catch (err) {
					console.error('Decryption resulted in invalid JSON:', err);

				}
				return decoded;
			},

		}
	}
</script>

<style lang="scss">
	.wxlogin_box {
		width: 100%;
		height: 100vh;
		background-color: #ffffff;
		position: relative;

		.text_box {
			color: #555;
			width: 80%;
			font-size: 26rpx;
			height: 70vh;
			margin-left: 10%;
			background: #fff;
			overflow-y: auto;
			padding: 20rpx;
			line-height: 42rpx;
			font-size: 24rpx;
			border-radius: 16rpx;
		}

		.img {
			width: 160rpx;
			height: 80px;
			position: absolute;
			left: 50%;
			top: 25%;
			transform: translatex(-50%);
		}

		.text1 {
			width: 80%;
			height: 100rpx;
			padding: 15rpx 0;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: #76B9FE;
			border-radius: 62rpx 62rpx 62rpx 62rpx;
			font-size: 40rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			// letter-spacing: 10px;
			position: absolute;
			top: 40%;
			left: 50%;
			transform: translateX(-50%);
		}

		.agreement {
			position: absolute;
			top: 60%;
			display: flex;
			justify-content: center;
			width: 100vw;
		}

		.phone {
			background-color: #fff !important;
			top: 70%;
			color: #065AE2;
			border: 1rpx solid #065AE2;
		}
	}
</style>